const Child2 = {
	isJiess: true,
	setup() {
		this.add(
			this.slot('test', {
				// 作用域插槽反馈数据
				$slotData: {
					message: '作用域插槽反馈出来的数据'
				}
			})
		);
	}
}

const Child1 = {
	isJiess: true,
	setup() {
		this.add(
			this.render({ is: 'JiessFragment' },
				// 定义一个插槽
				this.slot('test'),
				this.render({
					is: Child2,
					$slots: {
						test(prop) {
							return prop?.message
						}
					}
				})
			)
		);
	}
}
// 由于需要大量用到上下文中的方法和属性
// 所以，setup函数一定要定义为function
export default async function() {
	const { $val, $ref } = $modules;
	const count = $ref(888);
	// node节点值每秒刷新一次
	setInterval(() => {
		count.value++;
	}, 1000);

	const node = this.render({
		children: $val(count, 'value')
	});

	this.add(
		this.render({ className: 'outer' },
			this.render({ is: 'JiessFragment' },
				this.render({ className: 'inner' },
					this.render({
						is: Child1,
						$slots: {
							test: () => {
								const child = $ref('初始值');
								setTimeout(() => {
									// 等待2秒后，更新子元素
									child.value = node;
								}, 2000);
								return this.render({
									children: $val(child, 'value')
								})
							}
						}
					})
				)
			)
		)
	)
}